import 'dart:ui';
import 'package:flutter/material.dart';
import 'package:city_corner/detail-page/index.dart';

class ListItem extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _ListItem();
}

class _ListItem extends State<StatefulWidget> {
  List<Map> itemList = [];
  String text = 'Hi';

  @override
  initState() {
    super.initState();
    setItemList();
  }

  @override
  didChangeDependencies() {
    super.didChangeDependencies();
  }

  void setItemList() {
    List<Map> _itemList = [];
    for (int i = 0; i < 20; i++) {
      _itemList.add({
        "id": i.toString(),
        "label": '房子房子$i',
        "image": 'images/thumbnail.jpg',
        "price": '900',
        "tags": ['临地铁', '带阳台']
      });
    }
    setState(() {
      itemList = _itemList;
    });
  }

  Widget _getItem(index) {
    return InkWell(
      onTap: () {
        Navigator.push(context, MaterialPageRoute(builder: (_) {
          return DetailPage(id: itemList[index]['id']);
        }));
      },
      child: Container(
        height: 80.0,
        padding: EdgeInsets.fromLTRB(10, 0, 10, 0),
        child: Row(children: [
          ClipRRect(
              borderRadius: BorderRadius.circular(5.0),
              child: Image.asset(itemList[index]["image"],
                  width: 110.0, height: 80.0, fit: BoxFit.cover)),
          SizedBox(
            width: 10,
          ),
          Column(
            children: [
              Text(
                itemList[index]["label"],
                style: TextStyle(fontSize: 18.0, color: Colors.green),
                overflow: TextOverflow.ellipsis,
                maxLines: 2,
              ),
              Row(
                children: getTags(index),
              ),
              Text('${itemList[index]["price"]}/月')
            ],
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          ),
          Divider(height: 5, color: Colors.red)
        ]),
      ),
    );
  }

  List<Widget> getTags(index) {
    List<Widget> tags = [];
    for (String tag in itemList[index]["tags"]) {
      tags.add(Container(
        decoration: BoxDecoration(
            border: Border.all(color: Colors.grey, width: 1.0),
            borderRadius: BorderRadius.all(Radius.circular(5.0))),
        padding: EdgeInsets.all(3.0),
        child: new Text(tag, style: new TextStyle(fontSize: 10.0)),
        margin: EdgeInsets.only(right: 5.0),
      ));
    }
    return tags;
  }

  @override
  Widget build(BuildContext context) {
    return MediaQuery.removePadding(
        context: context,
        removeTop: true,
        child: ListView.separated(
          itemBuilder: (context, index) {
            return itemList.length > 0 ? _getItem(index) : Text('空');
          },
          separatorBuilder: (context, index) {
            return Divider(height: 10, indent: 75, color: Color(0xFFDDDDDD));
          },
          itemCount: itemList.length,
        ));
  }
}
